<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="box">
        sdhfjhklajklsjf{{message}}aaaaaa
    </div>
    <script>
    // 初次渲染
    var data  = {
        message: '我的数据'
    }
    var divEl = document.querySelector('.box');
    var divText = divEl.textContent;
    var exp = /\{\{([^\{\}]+)\}\}/;
    if (exp.test(divText)) {
        var $1 = RegExp.$1;
        var message = data[$1]
        // divEl.innerHTML = divEl.innerHTML.replace(exp,data[$1]);
        divEl.textContent = divText.replace(exp,message);
    }

    // 改进版
    var val = data['message'];
    Object.defineProperty(data, 'message', {
        get: function() {
            return val;
        },
        set: function(newvalue) {
            var oldvalue = message;
            divEl.textContent =  divEl.textContent.replace(oldvalue, newvalue);
        }
    })
    data.message = '王俊凯'
    </script>
</body>
</html>